<template>
  <Form ref="edit-form" :label-width="100" :model="operator" :rules="rules" style="margin-top: 15px;">
    <Row>
      <Col span="24">
      <FormItem label="账号" prop="account">
        <Input v-model="operator.account" placeholder="请输入账号"></Input>
      </FormItem>
      </Col>
    </Row>
    <Row>
      <Col span="24">
      <FormItem label="密码" prop="password">
        <Input v-model="operator.password" type="password" :placeholder="needPassword ? '请输入密码' : '输入密码以修改密码'"></Input>
      </FormItem>
      </Col>
    </Row>
    <Row v-if="operator.password">
      <Col span="24">
      <FormItem label="再次输入密码" prop="repassword" key="repassword">
        <Input v-model="operator.repassword" type="password" placeholder="请再次输入密码"></Input>
      </FormItem>
      </Col>
    </Row>
    <Row>
      <Col span="24">
      <FormItem label="姓名" prop="name">
        <Input v-model="operator.name" placeholder="请输入姓名"></Input>
      </FormItem>
      </Col>
    </Row>
    <Row v-if="needIdentity">
      <Col span="24">
      <FormItem label="身份" prop="identity">
        <Select v-model="operator.identity" placeholder="请选择身份">
          <Option v-for="(identity, index) in subordinates.filter(sub=>{if(sub !== '超级管理员'){return sub}})" :key="index" :value="identity">{{identity}}</Option>
        </Select>
      </FormItem>
      </Col>
    </Row>
  </Form>
</template>
<script>
export default {
  name: 'edit_operator',
  props: {
    operator: {
      type: Object,
      default () {
        return {}
      }
    },
    subordinates: {
      type: Array,
      default () {
        return ["管理员","编辑","红娘","运营","第三方"]
      }
    },
    needPassword: {
      type: Boolean,
      default: false
    },
    needIdentity: {
      type: Boolean,
      default: true
    }
  },
  data() {
    return {
      rules: {
        account: [{
          required: true,
          trigger: 'blur',
          validator: (rule, value, callback) => {
            if (!value || value === '') {
              callback(new Error('账号不能为空'))
            } else if (value.length < 4) {
              callback(new Error('账号长度必须超过4位'))
            } else {
              callback()
            }
          }
        }],
        password: [{
          required: this.needPassword,
          trigger: 'blur',
          validator: (rule, value, callback) => {
            if (this.needPassword) {
              if (!value || value === '') {
                callback(new Error('密码不能为空'))
              } else if (value.length < 6) {
                callback(new Error('密码长度必须超过6位'))
              } else {
                callback()
              }
            } else {
              if (!value || value === '') {
                callback()
              } else if (value.length < 6) {
                callback(new Error('密码长度必须超过6位'))
              } else {
                callback()
              }
            }
          }
        }],
        repassword: [{
          required: true,
          trigger: 'blur',
          validator: (rule, value, callback) => {
            if (value !== this.operator.password) {
              callback(new Error('两次输入的密码必须一致'))
            } else {
              callback()
            }
          }
        }],
        name: [{
          required: true,
          trigger: 'blur',
          validator: (rule, value, callback) => {
            if (!value || value === '') {
              callback(new Error('姓名不能为空'))
            } else {
              callback()
            }
          }
        }],
        identity: [{
          required: true,
          trigger: 'blur',
          validator: (rule, value, callback) => {
            if (!value || value === '') {
              callback(new Error('身份不能为空'))
            } else {
              callback()
            }
          }
        }]
      }
    }
  },
  methods: {},
  created() {}
}

</script>
